import QtQuick 2.0
import Sailfish.Silica 1.0
import "../config"

Rectangle {
    id:root
    width: viewWidth===-1 ? container.width + 2 * horizontalMargin : viewWidth - 2 * horizontalMargin
    height: viewHeight===-1 ? container.height + 2 * verticalMargin : viewHeight - 2 * verticalMargin
    radius: Math.min(height,width)/2
    color: AppColor.themeMode.transparent

    //文字变量
    property string text: ""
    property bool fontBold: false
    property int textSize: Theme.fontSizeLarge
    property color textColor: AppColor.themeMode.primaryColor


    //组件尺寸变量
    property int viewHeight: -1
    property int viewWidth: -1
    property int padding: 0
    property int horizontalPadding: padding
    property int verticalPadding: padding
    property int margin: 0
    property int horizontalMargin: margin
    property int verticalMargin: margin

    //组件颜色变量
    property color backgroundColor: AppColor.themeMode.primaryComponentColor

    //逻辑变量
    property bool checked: false

    //点击事件
    signal clicked()

    Rectangle {
        id:container
        width: viewWidth===-1?label.implicitWidth + 2 * horizontalPadding : parent.width - 2 * horizontalPadding
        height: viewHeight===-1?label.implicitHeight + 2 * verticalPadding : parent.height - 2 * verticalPadding
        radius: Math.min(height,width)/2
        color: backgroundColor
        anchors.verticalCenter: parent.verticalCenter
        anchors.horizontalCenter: parent.horizontalCenter
        border {
            width: checked?3:0
            color: AppColor.themeMode.primaryColor
        }

        Label {
            id:label
            text: root.text
            color: root.textColor
            font.pixelSize: root.textSize
            font.bold: root.fontBold
            horizontalAlignment: Text.AlignHCenter
            verticalAlignment: Text.AlignVCenter
            anchors.verticalCenter: parent.verticalCenter
            anchors.horizontalCenter: parent.horizontalCenter
        }
    }

    //点击事件
    MouseArea {
        anchors.fill: parent
        onClicked: {
            root.clicked()
        }
    }

}
